import React from 'react';
import { Table, Space, Popconfirm } from 'antd';
import './tablelist.css';
import { Link } from 'umi';
import { batchDeleteActivity } from '../../services/actives';

const TableList = (props) => {
  const confirm = (activityBasicId) => {
    const arr = [];
    arr.push(activityBasicId);
    batchDeleteActivity(props.queryTableList(props.pagination));
  };
  const columns = [
    {
      title: '活动名称',
      dataIndex: 'activityName',
      key: 'activityName',
    },
    {
      title: '创建人',
      dataIndex: 'creator',
      key: 'creator',
    },
    {
      title: '创建时间',
      key: 'startDate',
      dataIndex: 'startDate',
    },
    {
      title: '活动时间',
      key: 'endDate',
      dataIndex: 'endDate',
    },
    {
      title: '状态',
      key: 'activityStatus',
      render: (text, record) => (
        <Space size="middle">
          {!record.isDraft && <span style={{ color: 'rgb(12, 150, 130)' }}>待审核</span>}
          {record.isDraft && record.activityStatus == '1' && (
            <span style={{ color: 'rgb(160, 160, 160)' }}>草稿</span>
          )}
        </Space>
      ),
    },
    {
      title: '操作',
      key: 'use',
      render: (text, record) => (
        <Space size="middle">
          {record.isDraft && (
            <Link to={{ pathname: '/add', state: { activityBasicId: record.activityBasicId } }}>
              编辑
            </Link>
          )}
          {record.isDraft && (
            <Popconfirm
              placement="top"
              title="确定删除吗？"
              onConfirm={() => {
                confirm(record.activityBasicId);
              }}
              okText="Yes"
              cancelText="No"

              // <Link to={`details/${record.activityBasicId}`}>删除</Link>
            >
              <a>删除</a>
            </Popconfirm>
          )}
          {!record.isDraft && <Link to={`details/${record.activityBasicId}`}>详情</Link>}
        </Space>
      ),
    },
  ];

  const handleTableChange = (pagination, filters, sorter) => {
    props.changepage(pagination, filters, sorter);
  };
  return (
    <Table
      columns={columns}
      rowKey={(record) => record.activityBasicId}
      loading={props.loading}
      dataSource={props.data}
      pagination={props.pagination}
      onChange={handleTableChange}
    />
  );
};

export default TableList;
